<template>
	<view class="tui_order_box">
		<view class="tui_order_info">
			<view class="tui_order_item">
				<span class="tui_order_item_title">退款方式</span>
				<view @click="tui_pop" class="tui_order_item_choose">
					<span>{{type_text}}</span>
					<u-icon name="arrow-right" color="#ccc" size="28"></u-icon>
				</view>
			</view>
			<view v-if="submit.choose_type == 1" class="tui_order_item">
				<span class="tui_order_item_title">退款金额</span>
				<input :placeholder="`最多可退款${tui_info.postage}日元`" type="digit" @blur="input_blure" @input="input_change" v-model="submit.num"  placeholder-style="color:#ccc;font-size:24rpx;" />
			</view>
			<view class="tui_order_item" style="border-bottom: none;">
				<span class="tui_order_item_title">退款原因</span>
			</view>
			<view class="" style="padding: 0 16rpx;">
				<u-input v-model="submit.desc" placeholder-style="color:#ccc;font-size:24rpx;" type="textarea" height="300"  :border="false" placeholder="请输入退款原因" />
			</view>
		</view>
		<u-action-sheet  @click="type_choose" :list="type_list" v-model="show"></u-action-sheet>
		<view  class="button_submit" style="padding:16rpx 32rpx;">
			<u-button @click="onSubmit()" class="btns2" :custom-style="{'background':'#6993b7' ,color:'#fff'}"   :hair-line="false" :ripple="true" ripple-bg-color="rgba(9, 82, 200, 0.15)">提交</u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show:false,
				submit:{
					choose_type:null,//选择的退款方式
					num:'',//退款金额
					desc:'',//退款原因
				},
				type_list:[
					{text: '部分退款' , status:1},
					{text: '全额退款' , status:2},
				],
				type_text:'请选择退款方式',
				tui_info:{}
			}
		},
		onLoad(parames) {
			this.tui_info = JSON.parse(parames.data)
			// console.log(this.tui_info)
		},
		onShow() {},
		
		
		methods: {
			input_change(e){
				var num = this.$geShi(e.detail.value)
				num =Number(num)
				this.submit.num = num
				this.$forceUpdate()
			},
			input_blure(e){
				var num = this.$geShi(e.detail.value)
				num = Number(num)
				if(num>Number(this.tui_info.postage)){
					uni.showToast({
						title : `最多可退款${this.tui_info.postage}日元`,
						icon:'none'
					})
					this.submit.num = this.tui_info.postage
				}else{
					this.submit.num = num
				}
				this.$forceUpdate()
			},
			tui_pop(){
				this.show = true
			},
			type_choose(e){
				// console.log(e)
				this.type_text = this.type_list[e].text
				this.submit.choose_type = this.type_list[e].status
			},
			onSubmit(){
				
				if(this.submit.choose_type == null){
					uni.showToast({
						title:'请选择退款方式',
						icon:'none'
					})
					return
				}
				this.submit.num = Number(this.submit.num)
				if(this.submit.choose_type == 1 && this.submit.num <= 0 ){
					uni.showToast({
						title:'请输入退款金额!',
						icon:'none'
					})
					return
				}
				if(this.submit.choose_type == 2){
					this.submit.num = this.tui_info.postage
				}
				var data = {
					"buy_id":this.tui_info.id, //邮费退款订单id
					"is_apply_refund_postage": this.submit.choose_type, //1全部退款 2 部分退款
					"apply_refund_postage":  this.submit.num, //申请退款邮费金额
					"refund_postage_reason": this.submit.desc, //退款金额
				}
				this.$gugoApi.apply_refund_postage(data).then(res=>{
					uni.showToast({
						title:'申请成功',
						icon:'none'
					})
					setTimeout(()=>{
						uni.redirectTo({
							url:`/pages/order_other_list/order_other_list?type=1&current=10`
						})
					} , 1200)
				
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	@import url(./index.scss);
</style>
